<template>
	<view class="posts">

		<view class="posts-item" v-for=" po in posts" :key="po.key">

			<image :src="`http://192.168.1.51:8090/api/files/${po.collectionId}/${po.id}/${po.img_main}`"
				mode="aspectFit">
			</image>

			<view class="posts-title">

				<navigator :url="`/pages/detail/detail?post_id=${po.id}&title=${po.title}`">
					{{po.title}}
				</navigator>
			</view>
			<view class="posts-addr">
				{{po.addr}}
			</view>

		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		getPostsApi
	} from '../../api/index.js';

	import {
		onLoad
	} from '@dcloudio/uni-app';

	const posts = ref([]);

	onLoad((e) => {
		console.log(e.filter);
		getFoods(e.filter);
		uni.setNavigationBarTitle({
			title: e.title
		})
	})

	async function getFoods(filter) {
		const res = await getPostsApi(filter);
		posts.value = res.data.items;
	}
</script>

<style lang="scss" scoped>
	.posts {
		.posts-item {
			border: solid 1px;
			padding: 10rpx;
			margin: 10rpx;
		}
	}
</style>